<template>
    <div class="pad big_box">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item>财务管理</el-breadcrumb-item>
            <el-breadcrumb-item>工资管理</el-breadcrumb-item>
        </el-breadcrumb>
        <el-divider></el-divider>
        <el-row :gutter="5">
            <el-form :model="form"  class="row-bg" ref="queryform_Finance">
                <el-col :span="3">
                    <el-form-item class="elformitem" prop="ProjectId">
                        <el-select  filterable placeholder="请选择项目" v-model="form.ProjectId" style="width: 100%">
                            <el-option value="0" label="请选择项目">请选择项目</el-option>
                            <el-option v-for="v in AllProject" :value="v.Id" :data-userid="v.Id" :label="v.ProjectName" v-text="v.ProjectName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="3">
                    <el-form-item class="elformitem" prop="CustomerId">
                        <el-select filterable placeholder="请选择员工" v-model="form.CustomerId" style="width: 100%">
                            <el-option value="0" label="请选择员工">请选择员工</el-option>
                            <el-option value=" ">全部</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="3">
                    <el-date-picker type="date" style="width:100%"
                                    v-model="date.Start"
                                    placeholder="开始时间">
                    </el-date-picker>
                </el-col>
                <el-col :span="3">
                    <el-date-picker type="date" style="width:100%"
                                    v-model="date.End"
                                    placeholder="结束时间">
                    </el-date-picker>
                </el-col>
                <el-col :span="1">
                    <el-button style="width:100%" icon="el-icon-search" @click="SelFinance"></el-button>
                </el-col>
                <el-col :span="1">
                    <el-button style="width:100%" icon="el-icon-refresh-right" @click="SelFinance_Refresh"></el-button>
                </el-col>
                <el-col :span="3">
                    <el-button type="success"   @click="ShowAdd">添加</el-button>
                </el-col>
            </el-form>
        </el-row>

        <el-row :span="20" :offset="2" style="margin-top: 10px" class="row-bg">
            <el-col>
                <el-table :data="tableData"
                          style="width: 100%"
                          ref="multipleTable"
                          border>
                    <el-table-column header-align="center" fixed type="index" label="序号" align="center" :index="_indexMethod"></el-table-column>
                    <el-table-column header-align="center" fixed prop="Code" label="员工姓名" align="center">
                        <template slot-scope="scope">
                            {{_UserById(scope.row.CustomerId)}}
                        </template>
                    </el-table-column>
                    <el-table-column header-align="center" fixed prop="Code" label="项目" align="center">
                        <template slot-scope="scope">
                            {{_ProjectById(scope.row)}}
                        </template>
                    </el-table-column>
                    <el-table-column header-align="center" fixed prop="Money" label="应发工资" align="center"> </el-table-column>
                    <el-table-column header-align="center" fixed prop="PersonalTax" label="个税" align="center"> </el-table-column>
                    <el-table-column header-align="center" fixed prop="NetMoney" label="实发工资" align="center"> </el-table-column>
                    <el-table-column header-align="center" fixed prop="CollectionDate" label="日期" align="center">
                        <template slot-scope="scope">
                            <label>{{fmtDate(scope.row.CollectionDate) }}</label>
                        </template>
                    </el-table-column>
                    <el-table-column header-align="center" fixed prop="Remark" label="备注" align="center" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column header-align="center" fixed prop="CategoryDescript" label="操作" align="center">
                        <template slot-scope="scope">
                            <el-button type="success" size="mini" @click="UpFinance(scope.row)" plain>编辑</el-button>
                            <el-button type="danger" size="mini" plain @click="DEleById(scope.row)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-col>
            <el-col :span="24">
                <div class="block" style="float: right">
                    <el-pagination @size-change="SelFinance"
                                   @current-change="SelFinance"
                                   :current-page.sync="pagination.currentPage"
                                   :page-sizes="pagination.pagesizes"
                                   :page-size.sync="pagination.pagesize"
                                   layout="total, sizes, prev, pager, next, jumper"
                                   :total.sync="pagination.total">
                    </el-pagination>
                </div>
            </el-col>
        </el-row>

        <div>
            <el-dialog :visible.sync="AddFinanceShow" width="60%" title="添加/修改工资" @close="CloseAddUp">
                <AddAndUpFinance :formDB="formDB"
                                 :AllCustomer="AllCustomer"
                                 :AllUsers="AllUsers"
                                 :AllProject="AllProject"
                                 :AllFinanceBankCard="AllFinanceBankCard"
                                 :btnNumber="btnNumber">
                </AddAndUpFinance>
            </el-dialog>
        </div>
    </div>
</template>
<script>
    import * as publicjs from "/public/Scriput/Public"
    import AddAndUpFinance from "./AddAndUpFinance"
    export default {
        name: "Finance",
        components: {
            'AddAndUpFinance': AddAndUpFinance,
        },
        data() {
            return {
                AddFinanceShow: false,
                btnNumber: 1,
                AllProject: [],
                AllCustomer: [],
                AllUsers: [],
                tableData: [],
                AllFinanceBankCard: [],
                date: {
                    Start: '',
                    End: '',
                },
                form: {
                    CollectionNumber: '',
                    CollectionType: '0',
                    ProjectId: '0',
                    CustomerId: '0',
                },
                formDB: {
                    CollectionDate: '',
                    ProjectId: '',
                    CustomerId: '',
                    Money: '',
                    PersonalTax: '',
                    NetMoney: '',
                    Remark: '',
                },
                //分页数据绑定
                pagination: {
                    currentPage: 1,
                    pagesizes: [30, 50, 100,],
                    pagesize: 30,
                    total: 0
                },
            }
        },
        created() {
            this.AllUsers = publicjs.GetCompanyAllUsers(this.$http);
            this.AllProject = publicjs.GetAllProject(this.$http);
            this.AllCustomer = publicjs.GetAllCustomer(this.$http);
            this.SelFinance();
        },
        methods: {
            fmtDate(obj) {
                return obj.split(' ')[0];
            },
            _indexMethod(index) {
                return ((this.pagination.currentPage - 1) * this.pagination.pagesize) + index + 1
            },
            GetCollTypeByid(d) {
                if (d.CollectionType == 1) {
                    return "开票";
                }
                else if (d.CollectionType == 2) {
                    return "贷款";
                }
                else if (d.CollectionType == 4) {
                    return "投资款";
                }
                else if (d.CollectionType == 8) {
                    return "政府补助";
                }
                else if (d.CollectionType == 16) {
                    return "打错退款";
                }
                else if (d.CollectionType == 32) {
                    return "借款退回";
                }
                else if (d.CollectionType == 64) {
                    return "保险赔款";
                }
                else if (d.CollectionType == 128) {
                    return "验证费";
                }
                else if (d.CollectionType == 256) {
                    return "银行利息";
                }
                else if (d.CollectionType == 512) {
                    return "借款";
                }
                else if (d.CollectionType == 1024) {
                    return "内部往来";
                }
                else if (d.CollectionType == 2048) {
                    return "保证金";
                }
                else if (d.CollectionType == 4096) {
                    return "退款";
                }
                else if (d.CollectionType == 8192) {
                    return "预收款";
                }
                else if (d.CollectionType == 16384) {
                    return "其它";
                }
                else {
                    return " ";
                }
            },
            _UserById(id) {
                for (var i = 0; i < this.AllUsers.length; i++) {
                    if (this.AllUsers[i].Id == id) {
                        return this.AllUsers[i].UserName;
                    }
                }
            },
            CustomerCompanyById(d) {
                return publicjs.arrayByIdtoobj(this.AllCustomer, d.CustomerId, "CustomerCompany")
            },
            _ProjectById(d) {
                return publicjs.arrayByIdtoobj(this.AllProject, d.ProjectId, "ProjectName")
            },
            _BankCardById(d) {
                return publicjs.arrayByIdtoobj(this.AllFinanceBankCard, d.FinanceBankId, "CardName")
            },
            SelFinance() {
                let loadding = this.openLoading();
                this.$http.post('/Finance/GetFinanceCollectionDetail', {
                    offset: this.pagination.currentPage,
                    limit: this.pagination.pagesize,
                    date: this.date,
                    form: this.form,
                }).then(x => {
                    loadding.close();
                    this.pagination.total = x.data.count
                    this.tableData = x.data.data;
                });
            },
            //重置刷新
            SelFinance_Refresh(){
                this.$refs["queryform_Finance"].resetFields()
                this.date.Start = ''
                this.date.End = ''
                this.SelFinance()
            },
            //添加财务信息
            ShowAdd() {
                // this.$http.post('/Finance/AddFinanceCollectionBit').then((result) => {
                //     if (!result.data.bit) {
                //         this.$message.error("无添加收款权限")
                //     } else {
                //         this.btnNumber = 1;
                //         this.AddFinanceShow = true;
                //     }
                // });
                this.btnNumber = 1;
                this.AddFinanceShow = true;
            },
            CloseAddUp() {
                this.formDB.CollectionType = '',
                    this.formDB.CollectionDate = '',
                    this.formDB.ProjectId = '',
                    this.formDB.CustomerId = '',
                    this.formDB.Money = '',
                    this.formDB.PersonalTax = '',
                    this.formDB.NetMoney = '',
                    this.formDB.Remark = '';
                this.SelFinance();
            },
            UpFinance(obj) {
                this.btnNumber = 2;
                this.formDB = JSON.parse(JSON.stringify(obj));
                this.AddFinanceShow = true;
            },
            DEleById(obj) {
                this.$confirm('你确定要删除吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'error'
                }).then(() => {
                    let loadding = this.openLoading();
                    this.$http.get('/Finance/DeleteFinanceCollection?id=' + obj.Id).then((result) => {
                        loadding.close();
                        if (result.data.msg.IsSuccess) {
                            this.$message.success(result.data.msg.Msg)
                            this.SelFinance();
                        } else {
                            this.$message.error(result.data.msg.Msg)
                        }
                    });

                });
            },
        }
    }
</script>
<style scoped>
    .el-row{
        padding-top:5px;
    }
    .pad {
        padding:20px;
    }
    .elformitem{
        margin-bottom: 0px !important;
    }
</style>
